<template>
  <van-button block type="primary" @click="doCreateTeam">创建队伍</van-button>
  <van-tabs sticky v-model:active="active" @change="doChange">
    <van-tab title="公开" name="PUBLIC">
      <TeamCardList :team-list="teamList"></TeamCardList>
    </van-tab>
    <van-tab title="加密" name="SECRET">
      <TeamCardList :team-list="teamList"></TeamCardList>
    </van-tab>
  </van-tabs>


</template>

<script setup lang='ts'>
import {useRouter} from "vue-router";
import {onMounted, ref} from "vue";
import {TeamSearchByCondition} from "../../services/api.ts";
import {showToast} from "vant";
import TeamCardList from '../../components/TeamCardList/index.vue'

const active = ref('PUBLIC')
const router = useRouter()
const teamList: API.TeamSearchResponse[] = ref({})
const doCreateTeam = () => {
  router.push('/team/add')
}
onMounted(async () => {
  await doChange()
})

const doChange = async () => {
  if (active.value === 'PUBLIC') {
    const res = await TeamSearchByCondition({
      params: {
        status: 0
      }
    })
    if (res.code === 0) {
      teamList.value = res.data.records
    } else {
      showToast(res.description)
    }
  } else if (active.value === 'SECRET') {
    const res = await TeamSearchByCondition({
      params: {
        status: 2
      }
    })
    if (res.code === 0) {
      teamList.value = res.data.records
    } else {
      showToast(res.description)
    }
  }
}


</script>
<style scoped>

</style>